<!-- teamInformation -->
<template>
  <div class="page_body">
    <HomeTop :topTitle="topTitle"></HomeTop>
    <div class="page_header">
      <div class="header_box">
        <img class="image_path" :src="teampath.background_image" alt="" />
        <div class="pas_paths">
          <p class="pas_path">{{ teampath.name }}</p>
        </div>
        <div class="pas_pathss">
          <img class="image_patntwo" :src="teampath.image_path" alt="" />
        </div>
      </div>
    </div>
    <div class="page_content">
      <div class="content">
        <van-tabs v-model="activeName" color="#016FFD">
          <van-tab title="成员" name="a">
            <div class="teamList">
              <img
                v-if="teampath.leader_photo != ''"
                class="teamImg"
                :src="teampath.leader_photo"
                alt=""
              />
              <div v-else class="empty">暂无图片</div>
              <div class="teamIntro">
                <div class="teamName">{{ teampath.leader_name }}</div>
                <div class="teamNum">领队</div>
              </div>
            </div>
            <div class="teamList">
              <img
                v-if="teampath.coach_photo != ''"
                class="teamImg"
                :src="teampath.coach_photo"
                alt=""
              />
              <div v-else class="empty">暂无图片</div>
              <div class="teamIntro">
                <div class="teamName">{{ teampath.coach_name }}</div>
                <div class="teamNum">教练</div>
              </div>
            </div>
            <div class="teamList" v-for="(item, index) in player" :key="index">
              <img
                v-if="item.photo != ''"
                class="teamImg"
                :src="item.photo"
                alt=""
              />
              <div v-else class="empty">暂无图片</div>
              <div class="teamIntro">
                <div class="teamIntro_path">
                  <div class="teamName">{{ item.name }}</div>
                  <img
                    class="imgsex"
                    v-if="item.sex == '男'"
                    src="../../assets/image/setnan.png"
                    alt=""
                  />
                  <img
                    class="imgsex"
                    v-if="item.sex == '女'"
                    src="../../assets/image/setnv.png"
                    alt=""
                  />
                </div>
                <div class="teamNum">队员</div>
              </div>
            </div>
          </van-tab>
          <van-tab title="比赛" name="b">内容 2</van-tab>
          <van-tab title="动态" name="c">内容 3</van-tab>
        </van-tabs>
      </div>
    </div>
  </div>
</template>
<style src="../../assets/css/function/teamInformation.css" scoped></style>
<script>
import HomeTop from "@/components/homeTop.vue";
import { Indicator, Toast } from "mint-ui";
import { Tab, Tabs } from "vant";
export default {
  name: "teamInformation",
  components: {
    HomeTop,
    [Tab.name]: Tab,
    [Tabs.name]: Tabs,
  },
  data() {
    return {
      topTitle: "球员信息",
      activeName: "a",
      player: [],
      teampath: {},
    };
  },
  mounted() {
    this.playerDetail();
  },
  methods: {
    playerDetail() {
      let url = "/mobile/teamDetail";
      let data = {
        team_id: this.$route.query.id,
      };
      Indicator.open();
      this.axios
        .post(url, data)
        .then((res) => {
          Indicator.close();
          if (res.code == 0) {
            this.player = res.player;
            this.teampath = res.team;
            // console.log(this.player, "res");
          } else {
            Toast({
              message: res.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },
  },
};
</script>

<style scoped >
.van-tab__pane {
  overflow: hidden;
}
</style>
